<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script
            src="http://code.jquery.com/jquery-latest.js"></script>
    <meta charset="utf-8" />
    <title>用户登录系统</title><base target="_blank" />
    <style>
        *{
            padding:0px;
            margin:0px;
        }
        a{color:White}
        body{
            font-family:Arial, Helvetica, sans-serif;
            background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/grass.jpg) no-repeat center;
            font-size:13px;
        }
        img{
            border:0;
        }
        .lg{width:468px; height:468px; margin:100px auto; background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/login_bg.png) no-repeat;}
        .lg_top{ height:200px; width:468px;}
        .lg_main{width:400px; height:180px; margin:0 25px;}
        .lg_m_1{
            width:290px;
            height:100px;
            padding:60px 55px 20px 55px;
        }
        .ur{
            height:37px;
            border:0;
            color:#666;
            width:236px;
            margin:4px 28px;
            background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/user.png) no-repeat;
            padding-left:10px;
            font-size:16pt;
            font-family:Arial, Helvetica, sans-serif;
        }
        .pw{
            height:37px;
            border:0;
            color:#666;
            width:236px;
            margin:4px 28px;
            background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/password.png) no-repeat;
            padding-left:10px;
            font-size:16pt;
            font-family:Arial, Helvetica, sans-serif;
        }
        .bn{width:330px; height:72px; background:url(http://keleyi.com/keleyi/phtml/divcss/21/images/enter.png) no-repeat; border:0; display:block; font-size:18px; color:#FFF; font-family:Arial, Helvetica, sans-serif; font-weight:bolder;}
        .lg_foot{
            height:80px;
            width:330px;
            padding: 6px 68px 0 68px;
        }
    </style>
</head>

<body class="b">
<div class="lg">
    <form action="#" method="POST">
        <div class="lg_top"></div>
        <div class="lg_main">
            <div class="lg_m_1">

                <input name="username"  id="username"  class="ur" />
                <input name="password"   id="password"   type="password"  class="pw" />

            </div>
        </div>
        <div class="lg_foot">
            <input type="button" value="点这里登录" class="bn"  id="bn"  /></div>
    </form>
</div>
<div style="text-align:center;">
    <p><a href="http://keleyi.com/">首页</a> <a href="http://keleyi.com/keleyi/phtml/">特效库</a> <a href="http://keleyi.com/a/bjae/6asac24d.htm">原文</a></p>
</div>
</body>
<script type="text/javascript">

    $("#bn").click(function(){
        var username=$("#username").val();
        var password=$("#password").val();
        console.log(username);
        console.log(password);
        var error="";
        if (username.length=="") {
            error+="用户名不能为空";
            error+="\n";

        }
        if (password.length=="") {
            error+="密码不能为空";
            error+="\n";
        }
        if (error!="") {
            alert(error);
        }
        else{
            /* debugger */
            $.ajax({
                type:'POST',
                /* dataType:'json', */
                dataType:'json',
                url:'http://localhost:8080/panhai/login',
                contentType:'application/json;charset=UTF-8',

                data:JSON.stringify({"username":username,"password":password}),

                success:function(data){//返回json结果

                    //username==data.username&&password==data.password
                    if(username==data.username&&password==data.password){
                        //alert("用户名密码错误");//JSON.stringify(data)
                        window.location.href="success.html?username="+data.username;
                        //data.username
                    }

                    else {
                        //debugger;
                        alert("用户名密码,错误");
                    }

                }


            });

            /* console.log({"username":username,"password":password}); */


        }



    });

</script>




</html>
